<template>
	<view>
		<!--用户头像和昵称-->
		<view class="userInformation">
			<view class="userInfomation-avatar">
				<!-- <open-data type="userAvatarUrl"></open-data>    -->
				<image style="width: 100px; height: 80px;" src="https://thirdwx.qlogo.cn/mmopen/vi_32/POgEwh4mIHO4nibH0KlMECNjjGxQUq24ZEaGT4poC6icRiccVGKSyXwibcPq4BWmiaIGuG1icwxaQX6grC9VemZoJ8rg/132"></image>
			</view>
			<view class="userInformation-nickname">
				<!-- <open-data type="userNickName"></open-data> -->
				<text>{{nickname}}</text>
			</view>
			<!-- <view><text></text></view> -->
		</view>
		<!--间隔灰横条-->
		<view class="graydivide"></view>
		
		<view class='function' v-if="!show">
			<view style="width:100%">
				<view class="functioninformation" @click="deviceEnter">
					<!--左边图片&文字-->
					<view class="left-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/luru.png"></image>
					</view>
					<view class="text" bindtap="pay">设备录入</view>
					<!--文字-->
					<view class="right-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/right.png"></image>
					</view>
				</view>
			</view>
		</view>
		<!--间隔灰横条-->
		<view class="graydivide"></view>
		<view class='function' v-if="show">
			<view style="width:100%">
				<view class="functioninformation" @click="procureApprove">
					<!--左边图片&文字-->
					<view class="left-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/shenpi.png"></image>
					</view>
					<view style="font-style: normal; font-weight: normal; width: 100px; position: relative; left: 0px; display: flex; flex-direction: column;
								justify-content: center; color: gray;">物料审批(采购)</view>
					<!--文字-->
					<view class="right-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/right.png"></image>
					</view>
				</view>
			</view>
		</view>
		<!--间隔白横线-->
		<view class="whitedivide"></view>
		<view class='function' v-if="!show">
			<view style="width:100%">
				<view class="functioninformation" @click="sendPartsList">
					<!--左边图片&文字-->
					<view class="left-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/wuliao.png"></image>
					</view>
					<view class="text">物料管理</view>
					<!--文字-->
					<view class="right-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/right.png"></image>
					</view>
				</view>
			</view>
		</view>
		<!--间隔白横线-->
		<view class="whitedivide"></view>  
		<view class='function' v-if="!show">
			<view style="width:100%">
				<view class="functioninformation" @click="DeviceBindingApprovaList">
					<!--左边图片&文字-->
					<view class="left-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/shenpi2.png"></image>
					</view>
					<view style="font-style: normal; font-weight: normal; width: 100px; position: relative; left: 0px; display: flex; flex-direction: column;
								justify-content: center; color: gray;">设备绑定审批</view>
					<!--文字-->
					<view class="right-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/right.png"></image>
					</view>
				</view>
			</view>
		</view>
		<!--间隔白横线-->
		<view class="whitedivide"></view>
		<view class='function' v-if="!show">
			<view style="width:100%">
				<view class="functioninformation" @click="ReplacementCardApprovalList">
					<!--左边图片&文字-->
					<view class="left-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/shenpi3.png"></image>
					</view>
					<view class="text">补卡审批</view>
					<!--文字-->
					<view class="right-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/right.png"></image>
					</view>
				</view>
			</view>
		</view>
		<!--间隔白横线-->
		<view class="whitedivide"></view>
		<view class='function' v-if="!show">
			<view style="width:100%">
				<view class="functioninformation" @click="adminUserManual">
					<!--左边图片&文字-->
					<view class="left-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/shenpi3.png"></image>
					</view>
					<view style="font-style: normal; font-weight: normal; width: 100px; position: relative; left: 0px; display: flex; flex-direction: column;
								justify-content: center; color: gray;">管理员使用手册</view>
					<!--文字-->
					<view class="right-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/right.png"></image>
					</view>
				</view>
			</view>
		</view>
		<!--间隔白横线-->
		<view class="whitedivide"></view>
		<view class='function' v-if="show">
			<view style="width:100%">
				<view class="functioninformation" @click="purchaseUserManual">
					<!--左边图片&文字-->
					<view class="left-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/shenpi3.png"></image>
					</view>
					<view style="font-style: normal; font-weight: normal; width: 120px; position: relative; left: 0px; display: flex; flex-direction: column;
								justify-content: center; color: gray;">采购人员使用手册</view>
					<!--文字-->
					<view class="right-icon">
						<!--图片-->
						<image class="icon-picture" src="/static/right.png"></image>
					</view>
				</view>
			</view>
		</view>
		
		
		<button class="log-out" @click="logOutBt"> 退出登录 </button>
		
		<userTab selectedIndex = 1></userTab>
	</view>
</template>


<script>
	import { PDFView } from "../../common/PDFView.js";
	
	export default{
		data(){
			return{
				nickname: '',
				userid: '',
				show: false,
			}
		},
		onLoad() {
			this.nickname = uni.getStorageSync("nickname")
			this.userid = uni.getStorageSync("userid");
			uni.request({
				url: 'https://www.smacaftersales.com:443/findrolenameByUserid',
				data:{ userid : this.userid },
				method: 'GET',
				success: (res) => {
					if (res.data.data[0] == '采购人员') {
						this.show = true
					}
				}
			})	
		},
		methods: {
			deviceEnter(){  //设备录入
				uni.navigateTo({
					url: '/pages/adminVue/deviceEnter'
				})
			},
			logOutBt(){
				console.log('点击了退出登录',uni.getStorageSync("identify"))
				// uni.removeStorageSync("identify") //清除指定数据缓存
				uni.clearStorageSync()  // 清除所有 缓存 
				
				uni.navigateTo({
					url: '/pages/index/index'
				})
			},
			sendPartsList(){
				uni.navigateTo({
					url: '/pages/adminVue/examineApproveList'
				})
			},
			procureApprove(){
				uni.navigateTo({
					url: '/pages/adminVue/examineApproveProcureList'
				})
			},
			DeviceBindingApprovaList(){   //绑定申请 列表-
				uni.navigateTo({
					url:'/pages/adminVue/DeviceBindingApprovaList'
				})
			},
			ReplacementCardApprovalList(){  // 补卡 申请 列表 
				uni.navigateTo({
					url:"/pages/adminVue/ReplacementCardApprovalList"
				})
			},
			adminUserManual(){   //管理员 端说明书
				console.log("***点击 查看PDF*****")
				try {  
					const url = 'https://after.smacaftersales.com:9999/instructions/管理员.pdf';  
					this.PDFView.downloadAndOpenFile(url);
				} catch (err) {  
					console.error('文件下载或打开失败:', err);  
					uni.showToast({
						title: "文件下载或打开失败",
						duration: 1500,
						icon:'none'
					})

				}  
			},
			// ------
			purchaseUserManual(){    //  采购 人员说明书
				try {
					const url = 'https://after.smacaftersales.com:9999/instructions/采购人员.pdf';  
					this.PDFView.downloadAndOpenFile(url)
				} catch (err) {  
					// console.error('文件下载或打开失败:', err);  
					uni.showToast({
						title: "文件下载或打开失败",
						duration: 1500,
						icon:'none'
					})
				
				} 
			}
			
			
		}
	}
</script>

<style>
	.userInformation {
		/*头像&微信名称*/
		display: flex;
		background-color: #ffffff;
	}

	.userInfomation-avatar {
		/*头像*/
		background-color: #ffffff;
		margin: 0 auto;
		display: flex;
		justify-content: center;
		overflow: hidden;
		width: 160rpx;
		height: 160rpx;
		margin: 20rpx;
		margin-top: 30rpx;
		margin-left: 40rpx;
		border-color: #ffffff;
	}

	.userInformation-nickname {
		/*昵称*/
		color: #000000;
		font-size: 22px;
		font-weight: bold;
		width: 320rpx;
		height: 120px;
		line-height: 120px;
	}

	.whitedivide {
		/*白色分割线*/
		height: 1px;
		background-color: #ffffff;
		width: 56px;
		position: relative;
		top: 0px;
	}

	.graydivide {
		/*灰色分割条*/
		height: 10px;
		background-color: #ededed;
		position: relative;
		top: 0px;
	}

	.function {
		width: 100%;
		background-color: #ffffff;
		margin-top: 0rpx;
		overflow: hidden;
		display: flex;
		/**/
	}

	.functioninformation {
		/*左边动作图标&文字说明*/
		display: flex;
	}

	.left-icon {
		display: flex;
		margin: 14px;
	}

	.icon-picture {
		/*图标*/
		display: flex;
		width: 28px;
		height: 28px;
	}

	.text {
		/*文字*/
		font-size: 14px;
		font-style: normal;
		font-weight: normal;
		width: 70px;
		position: relative;
		left: 0px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		color: gray;
	}

	.right-icon {
		/*右边图片*/
		display: flex;
		margin: 14px;
		position: absolute;
		right: 14px;
	}
	/* 退出登录   */
	.log-out{
		width: 200px;
		height: 50px;
		display: flex;
		margin-top: 60px;
		justify-content: center;
		border-radius: 25px;	
		border: 3rpx solid #6699FF;
		/* background: linear-gradient(to right, #ff00ff, #00ff7f, #00ffff); */
	}
</style>
